<template>
  <div class="MyResume">
    <div class="contentView">
      <Icon type="ionic"></Icon>
      <Icon type="iconfont  arrow-down-b" size="small" style="background-color: gold;width: 15px;height: 15px;color:red;"></Icon>
      
      <Icon type="ionic"></Icon>
      <!-- 头部 -->
      <Row class="wbdCv-baseTop">
        <Col :span="16" class="myDescView" offset="1">
          <Col class="myName">小军</Col>
          <Col style="margin-top: 15px;color:white;text-align: left;">5年移动端开发经验，熟悉开发流程</Col>
        </Col>
        <Col :span="7" class="myportrait">
          <a class="img-preview-hover 500dtongji" data-_track="PC-在线制作-文档编辑页-中间简历编辑-头像-上传照片"></a>
          <img class="portrait" src="../assets/portrait.jpg" alt>
        </Col>
      </Row>
      <Row>
        <Col span="16" offset="1">
          <Row class="paragraph">
            <p>求职意向</p>
            <Icon type=" ionic" size='medium' style="color:red;"></Icon>
            <Button type="text">浙江杭州</Button>
            <Button type="text" icon="ios-search">iOS开发工程师</Button>
            <Button type="text" icon="ios-search">13K-17K</Button>
            <Button type="text" icon="ios-search">一周到岗</Button>
          </Row>
          <Row style="margin-top:15px;">移动开发</Row>
        </Col>
        <Col span="7">基本信息</Col>
      </Row>
    </div>
  </div>
</template>

<script>
import common from "../common/common.js";

export default {
  name: "MyResume",
  components: {},
  data() {
    return {};
  },
  beforeCreate: function() {
    console.log("------beforeCreate创建前状态------");
  },
  created: function() {
    console.log("加载完成");
  },
  beforeMount() {
    console.log("挂起前的状态");
  },
  mounted: function() {
    console.log("------mounted 挂载结束状态------");
  },
  beforeUpdate: function() {
    console.log("beforeUpdate 更新前状态===============》");
  },
  updated: function() {
    console.log("updated 更新完成状态===============》");
  },
  methods: {},
  watch: {}
};
</script>

<style scoped>
.MyResume {
  display: flex;
  align-items: center;
  justify-content: center;
  /* height: 100vh; */
}
.contentView {
  background-color: white;
  width: 66vw;
}
.wbdCv-baseTop {
  background: #292929;
}
.myDescView {
  display: flex;
  justify-content: center;
  flex-direction: column;
  /* background-color: #385; */
  min-height: 180px;
}
.myportrait {
  display: flex;
  align-items: center;
  justify-content: center;
  /* background-color: red; */
  min-height: 180px;
}
.myName {
  padding-right: 10px;
  font-size: 30px;
  color: #fff;
  text-align: left;
}
.portrait {
  width: 122px;
  height: 122px;
  border-radius: 122px;
}
.paragraph {
  font-family: Microsoft YaHei;
  font-weight: 600;
  font-size: 24px;
}

.paragraph:after {
  content: "";
  display: block;
  width: 100%;
  margin-top: -5px;
  /* important */
  visibility: inherit !important;
  border-bottom: 1px solid #ccc;
}
</style>
